<template>
	<view>
		<bg-video></bg-video>
		<cu-custom bgColor="bg-main" :isBack="true">
			<block class="text-white" slot="content">提款记录</block>
		</cu-custom>

		<!-- 提现记录列表 -->
		<view class="margin-top">
			<view class="cu-list menu- card-menu">
				<view class="cu-item bg-white shadow padding" v-for="(item, index) in aclienttq" :key="item.tqjlid">
					<view class="flex-sub">
						<!-- 金额和状态 -->
						<view class="flex justify-between align-center">
							<text class="">{{item.amount/100}}元</text>
							<view class="cu-tag sm " :class="item.zt === 'F' ? 'bg-green light' : 'bg-orange light'">
								{{item.zt === 'F' ? '已到账' : '已提取'}}
							</view>
						</view>

						<!-- 提取时间 -->
						<view class="flex align-center margin-top-xs">
							<text class="text-gray">提取时间：</text>
							<text class="text-black margin-left-sm">{{item.ct}}</text>
						</view>

						<!-- 抽成比例 -->
						<view class="flex align-center margin-top-xs">
							<text class="text-gray">抽成比例：</text>
							<text class="text-black margin-left-sm">{{item.ccbl*100}}%</text>
						</view>

						<!-- 实际金额 -->
						<view class="flex align-center margin-top-xs">
							<text class="text-gray">实际金额：</text>
							<text class="text-price text-main text-bold margin-left-sm">{{item.sjje/100}}</text>
						</view>
					</view>
				</view>
			</view>

			<!-- 无数据提示 -->
			<view class="text-center padding-xl text-gray" v-if="aclienttq.length === 0">
				<text class="margin-left-sm">暂无提现记录</text>
			</view>
		</view>

		<!-- 显示更多按钮 -->
		<view class="flex justify-center margin-top-lg margin-bottom-xl" v-if="aclienttq.length < pageInfo.total">
			<button class="cu-btn bg-white shadow round" @tap="loadMore">
				<text class="text-main">显示更多</text>
			</button>
		</view>
	</view>
</template>

<script>
	export default {
		data: function() {
			return {
				pageInfo: {
					current: 1,
					size: 16,
					total: 0
				},
				aclienttq: []
			}
		},
		onLoad: function() {
			this.search();
		},
		methods: {

			search: function() {
				this.aclienttq = [];
				this.pageInfo.current = 1;
				this.loadtqs();
			},
			loadMore: function() {
				this.pageInfo.current++;
				this.loadtqs();
			},
			loadtqs: function() {
				this.api("/client/tq/page").send({
					current: this.pageInfo.current,
					size: this.pageInfo.size,
					searchKey: this.searchKey,
					client: this.store.state.client.clientid
				}).then(data => {
					this.pageInfo.total = data.aclienttqs.total;
					for (let index in data.aclienttqs.records) {
						let record = data.aclienttqs.records[index];
						this.aclienttq.push(record);
					}
				});

			},
		}
	}
</script>

<style>
</style>